<template>
    <div>
        <v-top>
            <h3>会员中心</h3>
        </v-top>


                <!-- 信息栏 -->
        <nav>
            <!-- 个人资料 -->
            <div class="personal flex">
                <div class="personalData flex">
                    <div class="profile">
                        <img src="../assets/img/01.png" alt="头像">
                    </div>
                    <div class="mine-personal">
                        <p>代用名</p>
                        <span class="font20">
                            完善资料让小U更懂您
                        </span>
                    </div>
                </div>
                <div class="daliyClick font20">
                    每日签到
                </div>
            </div>
            <!-- 收藏 浏览 习惯 -->
            <ul class="habit flex">
                <li class="flexC">
                    <strong>12</strong>
                    <span class="font20">我的收藏</span>
                </li>
                <li class="flexC">
                    <strong>12</strong>
                    <span class="font20">浏览记录</span>
                </li>
                <li class="flexC">
                    <p>
                        <span class="font20">￥</span>
                        <strong>0</strong>
                    </p>
                    <span class="font20">我的红包</span>
                </li>
                <li class="flexC">
                    <strong>12</strong>
                    <span class="font20">优惠券</span>
                </li>
            </ul>
            <!-- 我的订单 -->
            <div class="myOrder flexC">
                <div class="order-top flex">
                    <h4 class="fon32">我的订单</h4>
                    <span class="font24">
                        全部订单
                        <i class="iconfont icon-arrow-right font24"></i>
                    </span>
                </div>
                <ul class="order-bot flex">
                    <li class="flexC">
                        <img src="../assets/img/payment.png" alt="待付款">
                        <span class="font20">待付款</span>
                    </li>
                    <li class="flexC">
                        <img src="../assets/img/delivery.png" alt="待收货">
                        <span class="font20">待收货</span>
                    </li>
                    <li class="flexC">
                        <img src="../assets/img/evaluation.png" alt="评价">
                        <span class="font20">评价</span>
                    </li>
                    <li class="flexC">
                        <img src="../assets/img/service.png" alt="售后/退款">
                        <span class="font20">售后/退款</span>
                    </li>
                </ul>
            </div>
        </nav>
        <!-- 中间内容 -->
        <article class="data">
            <ul class="flexC">
                <li class="flex">
                    <div>
                        <img src="../assets/img/address.png" alt="地址管理">
                        <strong class="font24">地址管理</strong>
                    </div>
                    <i class="iconfont icon-arrow-right font24"></i>
                </li>
                <li class="flex">
                    <div>
                        <img src="../assets/img/wallet.png" alt="我的钱包">
                        <strong class="font24">我的钱包</strong>
                    </div>
                    <div class="dataRight">
                        <span class="font24">剩余200U币</span>
                        <i class="iconfont icon-arrow-right font24"></i>
                    </div>
                </li>
                <li class="flex">
                    <div>
                        <img src="../assets/img/QR_code.png" alt="二维码">
                        <strong class="font24">我的二维码</strong>
                    </div>
                    <i class="iconfont icon-arrow-right font24"></i>
                </li>
                <li class="flex">
                    <div>
                        <img src="../assets/img/partner.png" alt="我的伙伴">
                        <strong class="font24">我的小伙伴</strong>
                    </div>
                    <i class="iconfont icon-arrow-right font24"></i>
                </li>
                <li class="flex">
                    <div>
                        <img src="../assets/img/free.png" alt="免费">
                        <strong class="font24">0元试用</strong>
                    </div>
                    <i class="iconfont icon-arrow-right font24"></i>
                </li>
            </ul>
        </article>
    </div>
</template>

<script>
export default {
    data() {
        return {};
    },
};
</script>

<style scoped src="../assets/css/mine.css"></style>
